<!--
 * @Description: 月计划调整
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2023-06-07 14:37:53
 * @LastEditTime: 2023-06-22 15:10:19
 * @FilePath: \cscec-pms-admin\src\views\construction\monthPlanAdjust\monthPlanAdjustView.vue
-->
<template>
  <base-breadcrumb
    :title="breadcrumb"
    :breadcrumb="!isAudit"
  >
    <a-spin
      :spinning="loading"
      :tip="tip"
    >
      <a-card>
        <a-tabs
          v-model="tabs"
          @change="handleTabsChange"
        >
          <a-tab-pane
            :key="1"
            tab="基本信息"
          >
            <BasicInfo
              ref="basicInfo"
              :loading.sync="loading"
              :is-audit="isAudit"
            />
          </a-tab-pane>
          <a-tab-pane
            :key="2"
            tab="预调整"
          >
            <PresetAdjust
              ref="prevPresetAdjust"
              :is-audit="isAudit"
              :option="prevMonthOption"
            />
            <PresetAdjust
              ref="currentPresetAdjust"
              :is-audit="isAudit"
              :option="currentMonthOption"
            />
            <PresetAdjust
              ref="nextPresetAdjust"
              :is-audit="isAudit"
              :option="nextMonthOption"
            />
          </a-tab-pane>
          <a-tab-pane
            :key="3"
            tab="附件上传"
          >
            <title-name title="附件上传" />
            <u-table
              ref="uTable"
              :disabled="type==='detail'"
              :is-show="type!== 'detail'"
              :list-url="listUrl"
              :upload-list="uploadList"
              :delete-url="deleteUrl"
              :use-chinese="true"
              :business-id="adjustId"
              :req-method="'post'"
              business-code="PM53"
            />
          </a-tab-pane>
          <div
            v-if="!isAudit"
            slot="tabBarExtraContent"
            class="tool-btns mb20 page-btn-right-top"
          >
            <!-- <a-button
              type="primary"
              @click="$multiTab.close()"
            >
              保存草稿
            </a-button> -->
            <a-button
              v-if="type !== 'detail'"
              type="primary"
              :disabled="adjustId===''"
              :loading="submiting"
              @click="handleSubmit"
            >
              提交
            </a-button>
            <a-button
              class="ml20"
              @click="handleClose"
            >
              关闭
            </a-button>
          </div>
        </a-tabs>
        <div class="bottom-btn">
          <a-button
            v-if="tabs<3"
            type="primary"
            @click="handleTabsChange(currentTabs+1)"
          >
            下一步
          </a-button>
        </div>
      </a-card>
    </a-spin>

    <!-- 选择审批人 -->
    <selectApprover
      :business-id="businessId"
      :process-config="setProcessConfig"
    />
    <!-- 选择审批人 -->
  </base-breadcrumb>
</template>
<script>
import BasicInfo from './components/BasicInfo'
import PresetAdjust from './components/PresetAdjust'
import { view } from '@/api/construction/monthPlanAdjust'
import { producerApisUrl } from '@/api/config'
export default {
  name: 'monthPlanAdjustView' + Date.now(),
  props: {
    isAudit: {
      // 是否作为审批详情
      type: Boolean,
      default: false
    }
  },
  components: {
    BasicInfo,
    PresetAdjust
  },
  data() {
    return {
      // 面包屑名字
      breadcrumb: '',
      // 面包屑文字
      breadcrumbText: {
        add: '新增',
        update: '编辑',
        detail: '查看'
      },
      // 页面类型
      type: this.isAudit ? 'detail' : this.$route.query.pageType,
      // 标签key
      tabs: 1,
      // 记录当前标签页key
      currentTabs: 1,
      // 页面数据加载
      loading: false,
      //加载提示文字
      tip: '',
      // 附件
      attachmentList: [],
      // 附件上传
      listUrl: producerApisUrl + '/monthPlanAdjust/query-files',
      deleteUrl: producerApisUrl + '/monthPlanAdjust/deleteFile',
      uploadList: producerApisUrl + '/monthPlanAdjust/addFile',
      // 提交中
      submiting: false,
      // 流程配置
      processConfig: null,
      //点击提交发送流程配置值
      setProcessConfig: null,
      // 业务id
      businessId: null,
      // 上月逾期未完成节点配置项
      prevMonthOption: {
        title: '上月逾期未完成节点',
        businessType: 0
      },
      // 本月计划配置项
      currentMonthOption: {
        title: '本月计划',
        businessType: 1
      },
      // 下月重点计划配置项
      nextMonthOption: {
        title: '下月重点计划',
        businessType: 2
      }
    }
  },
  async created() {
    //获取通过获取流程配置值
    this.processConfig = await this.$getConfigFn('month_plan_adjust')
  },
  mounted() {
    this.breadcrumb = `${this.breadcrumbText[this.type]}月计划调整`
  },
  computed: {
    // 调整id
    adjustId() {
      return this.$route.query.id ?? ''
    }
  },
  methods: {
    /**
     * @description: 标签页变化
     * @param {number} key 标签页key
     * @return {void}
     */
    async handleTabsChange(key) {
      if (this.currentTabs < key) {
        // 前进
        // 阻止前进
        this.tabs = this.currentTabs
        switch (key) {
          case 2: {
            if (!this.isAudit && this.$route.query.pageType !== 'detail') {
              // 基本信息校验
              await this.$refs.basicInfo
                .handleSubmit()
                .then(() => {
                  this.tabs = key
                  this.currentTabs = key
                })
                .catch(() => {})
            } else {
              this.tabs = key
              this.currentTabs = key
            }
            break
          }
          case 3: {
            if (this.currentTabs === 1) {
              // 从基本信息跳转到附件
              if (!this.isAudit && this.$route.query.pageType !== 'detail') {
                // 基本信息校验
                await this.$refs.basicInfo
                  .handleSubmit()
                  .then(() => {
                    this.tabs = key
                    this.currentTabs = key
                  })
                  .catch(() => {})
              } else {
                this.tabs = key
                this.currentTabs = key
              }
            } else {
              this.tabs = key
              this.currentTabs = key
            }
            this.$nextTick(()=>{
              this.$refs.uTable.getFile()
            })
            break
          }
        }
      } else {
        // 后退
        this.tabs = key
        this.currentTabs = key
      }
      // 加载预调整数据
      if (this.tabs === 2) {
        this.$nextTick(() => {
          const timer = setTimeout(() => {
            this.$refs.prevPresetAdjust.loadData(true)
            this.$refs.currentPresetAdjust.loadData(true)
            this.$refs.nextPresetAdjust.loadData(true)
            clearTimeout(timer)
          })
        })
      }
    },
    /**
     * @description: 提交审核
     * @param {void}
     * @return {void}
     */
    handleSubmit() {
      let prev = this.$refs?.prevPresetAdjust 
      let current = this.$refs?.currentPresetAdjust 
      let next = this.$refs?.nextPresetAdjust
      if(prev && current && next){
        if (!prev.submitVerify() || !current.submitVerify() || !next.submitVerify()) {
          this.$message.warning('请先完成当前预调整节点的操作')
          return
        }
      }
      let vm = this
      // this.$confirm({
      //   title: '是否确定提交?',
      //   content: '',
      //   onOk() {
      vm.submiting = true
      vm.loading = true
      vm.setProcessConfig = null
      vm.submitApprovalConfirm(vm.processConfig, (flag) => {
        if (!flag) {
          vm.submiting = false
          vm.loading = false
          return
        }
        view
        .commitAudit({ adjustId: vm.adjustId })
        .then(({ code, data }) => {
          if (code === 200) {
            vm.$message.success('提交成功')
            vm.businessId = vm.adjustId
            vm.setProcessConfig = vm.processConfig
            vm.handleClose()
          }
        })
        .finally(() => {
          vm.submiting = false
          vm.loading = false
        })
      })
      
      //   }
      // })
    },
    /**
     * @description: 关闭
     * @param {void}
     * @return {void}
     */
    handleClose() {
      if (this.$route.query.pageType === 'add') {
        if (this.$route.query.id) {
          this.$close()
          this.$close()
        } else {
          this.$close()
        }
      } else {
        this.$close()
      }
    }
  }
}
</script>
<style lang="less" scoped>
.tabs-extra-btn {
  button {
    margin-left: 10px;
  }
}
.bottom-btn {
  display: flex;
  flex-direction: row-reverse;
}
</style>

